<div class="gt-http-error" ng-if="httpError">
  {{httpError.headline}}<br>
  <div class="gt-http-error-message" ng-if="httpError.message">{{httpError.message}}</div>
  <!-- need to use $parent since ng-if creates a child scope -->
  <a ng-click="$parent.showHttpErrorStackTrace = !showHttpErrorStackTrace"
     ng-if="httpError.stackTrace"
     class="gt-http-error-message"
     href="">
    {{showHttpErrorStackTrace ? 'hide stack trace' : 'show stack trace'}}
  </a>
  <div ng-if="showHttpErrorStackTrace">
    <!-- lack of spaces around {{httpError.stackTrace}} is important since it is formatted as 'pre' -->
    <div class="gt-http-error-stack-trace" ng-if="httpError.stackTrace">{{httpError.stackTrace}}</div>
  </div>
</div>
